<template>
  <div>
    <el-form>
      <el-tree
        ref="menuTree"
        :data="deptOptions"
        :props="defaultProps"
        :check-strictly="true"
        show-checkbox
        node-key="id"
        highlight-current
        :filter-node-method="filterNode"
        @node-click="nodeClick"
        @check-change="handleCheckChange"
      />
    </el-form>
  </div>
</template>

<script>
import { businessTree } from '@/api/lc/business'

export default {
  props: {
    isDisabled: String
  },
  name: 'chooseProcess',
  data() {
    return {
      queryParams: {
        processName: ''
      },
      // 部门树选项
      deptOptions: undefined,
      defaultProps: {
        children: 'children',
        label: 'label'
      }
    }
  },
  created() {
    this.getDeptTree()
  },
  methods: {
    /**
     * 初始化
     */
    init() {
      this.queryParams = {
        processName: ''
      }
      // 部门树选项
      this.deptOptions = undefined
      this.defaultProps = {
        children: 'children',
        label: 'label'
      }
      this.$refs.menuTree.setCheckedKeys([])
      this.getDeptTree()
    },
    /** 查询部门下拉树结构 */
    getDeptTree() {
      if (this.isDisabled === '无') {
        this.queryParams.businessLevel = 6
      }
      businessTree(this.queryParams).then(response => {
        this.deptOptions = response.data
        if (this.isDisabled === '无') {
          this.deptOptions.push({ id: 0, label: '无', parentId: 0, children: [], weight: '0' + '-' + ' ' })
        }
        console.log('this.deptOptions', this.deptOptions)
      })
    },
    filterNode(value, data) {
      if (!value) return true
      return data.label.indexOf(value) !== -1
    },
    //由于nodeClick被调用时checkChange也会被调用，因此需要一个editCheckId辅助避免出现因为联动导致选中状态错乱
    nodeClick(data, node, v) {
      // this.editCheckd = data.id
      // this.menu.parentId = data.parentId || null
      // this.menu.productId = data.id
      // this.menu.typeName = data.typeName
      // this.menu.typeCode = data.typeCode
      // this.menu.status = data.status
      // this.menu.sort = data.sort
      // this.$refs.form.clearValidate()
    },
    //节点选中状态发生变化时的回调，当选中另一个后，当前的的节点状态变化也会触发这个事件
    handleCheckChange(item, checked, self) {
      if (checked) {
        this.editCheckd = item.id
        this.$refs.menuTree.setCheckedKeys([item.id])
        // this.nodeClick(item)
        this.$emit('checkData', item)
      } else {
        if (this.editCheckd === item.id) {
          this.$refs.menuTree.setCheckedKeys([item.id])
        }
      }
    },
    resetQuery() {
      this.queryParams = {
        processName: ''
      }
      this.getDeptTree()
    },
    handleQuery() {
      this.getDeptTree()
    }
  }
}
</script>

<style scoped>

</style>
